<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="x-ua-compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1">

    <title>邮箱测试</title>
    <link rel="stylesheet" href="css/base.css" />
    <link rel="stylesheet" href="css/register.css" />
    <script type="text/javascript" src="js/html5shiv.js"></script>
  <link rel="stylesheet" type="text/css" href="css/style.css">
    <script type="text/javascript" src="/vue/dist/vue.js"></script>
    <script type="text/javascript" src="/axios/dist/axios.js"></script>
    <script type="text/javascript" src="js/jquery-1.11.3.min.js"></script>
    
</head>
<body>
    <div class="wrapper">
          <div class="header">
    <!-- <div class="logo">
      <img src="images/logo.png">
    </div> -->
  
    <div class="nav">
      <ul>
        <li><a href="#"></a></li>
      
      </ul>
    </div>
    <div class="clear"></div>
  </div>

        <div class="content">
	<br>
             <p style="font-size: 20px">
                 一.避免被恶意利用接口，就不开放编写内容之类的功能  
                </p>

            <p style="font-size: 20px">
<br>
                 二.本测试功能  前端采用vue 传输数据使用axios的post方式 </p>
 <p style="font-size: 20px">
<br>
	  三.前后端都设置时间限制的安全措施,可以自行进行测试
               </p>
 <p style="font-size: 20px">
<br>
	四.使用redis消息队列处理邮箱发送，使用supervisor工具使写好的PHP脚本保持运行<br>
	<a href="http://email.panview.cn/download/download.php">可以下载源码进行查看(点击下载)</a>
    </p>
 <p style="font-size: 20px">
<br>
	五.如果没收到邮箱提示,可能是进入了垃圾箱，邮箱白名单添加panview.cn即可正常收到邮箱提示
    </p>
            <form>
             
                <p class="pass-form-item">
                    <label class="pass-label">邮箱号</label>
                    <input id="email" type="email" name="email" class="pass-text-input" placeholder="请填写邮箱号" v-model="text">
                         <div  id="emailCode"  v-if="show"  @click='velidateEmail' style="position:relative;top: 16px;left: 316px;z-index: 9;cursor: pointer;font-size: 14px;display: block;color: #03a9f4;width:100px;line-height:10px;text-align:center;"><strong style="position: absolute;right: 0;top: 0;">发送验证码</strong></div>
                          <div  id="emailCode1" v-if="show"  style="position:relative;top: 16px;left: 316px;z-index: 9;cursor: pointer;font-size: 14px;display: block;color: #03a9f4;width:100px;line-height:10px;text-align:center;"><strong style="position: absolute;right: 0;top: 0;">已发送{{time}}s</strong></div>
                
                <div  id='emailError' v-text='text'  v-if='show' style="font-size: 14px;color:red;">
                       
                </div>
             
                </p>

            </form>
           
        </div>

    <div class="foot">
            <div>
                <div>© 2020 panview.cn 粤ICP备20069830号</div>
            </div>
        </div>
    </div>
    <script type="text/javascript">
        //提示错误控制器
        var emailError= new Vue({
            el:'#emailError',
            data:{
                text:'邮箱格式错误',
                show:0,
            }


        })
        //email text
        var email= new Vue({
            el:'#email',
            data:{
                text:'',
            }


        })

        //判断 不受到刷新影响的值
        var pantime=~~window.name

        //邮箱发送控制器2
        var emailCode1 = new Vue({
              el: '#emailCode1',
              data: {
                 time:20,
                 show:0
              }
        })
        //邮箱发送控制器2
        var emailCode = new Vue({
              el: '#emailCode',
              data:{
               show:1

              },
              methods: {
                 velidateEmail: function () {
                       
                       var pan=this
                        axios.post('http://email.panview.cn/redis.php', {
                        to:email.text,
                      })
                      .then(function (response) {

		if(response.data.status==-1){
			  emailError.show=1
				console.log(1)
		}else if(response.data.status==0){
console.log(2)
			emailError.text='请不要重复发送'
  			emailError.show=1
		                          pan.show = 0
                          emailCode1.show = 1
                          //判断
                          if(pantime<1){
                             window.name=emailCode1.time
                          }
                          else{
                             emailCode1.time=window.name
                          }
                          //时间控制器
                          timer = setInterval(()=>{    
                            window.name--
                            emailCode1.time=window.name
                            if(window.name==0){
                               emailCode1.show = 0
                               pan.show = 1
                               emailCode1.time=20
 		emailError.show=0
                                window.name= emailCode1.time
                              clearInterval(timer)
                            }
                          },1000)
				console.log(2)
		}else if(response.data.status==1){
console.log(3)

			   emailError.show=0
                          pan.show = 0
                          emailCode1.show = 1
                          //判断
                          if(pantime<1){
                             window.name=emailCode1.time
                          }
                          else{
                             emailCode1.time=window.name
                          }
                          //时间控制器
                          timer = setInterval(()=>{    
                            window.name--
                            emailCode1.time=window.name
                            if(window.name==0){
                               emailCode1.show = 0
                               pan.show = 1
                               emailCode1.time=20
 		
                                window.name= emailCode1.time
                              clearInterval(timer)
                            }
                          },1000)


      		}

            
                

                      })
                      .catch(function (error) {
                           emailError.show=1
                      });

              }
          }
        })
     
    </script>
</body>
</html>